.divination{
    height: 100%;
    color: #fff;
    padding: 40rpx;
    box-sizing: border-box;
    &-title{
        font-size: 30rpx;
        text-align: center;
        font-weight: bolder;
        margin-top: 100rpx;
    }

    &-subtitle{
        text-align: center;
        font-size: 24rpx;
        color: rgba(111, 111, 124, 1);
        margin-top: 10rpx;
        font-weight: bold;
        margin-bottom: 60rpx;
    }

    &-board{
        display: flex;

        &-item{
            width: 33.33%;
            text-align: center;
            margin-right: 20rpx;

            &-top{
                height: 260rpx;
                border: 1px solid rgba(106, 105, 113, 1);
                border-radius: 16rpx;
            }

            &-name{
                font-size: 26rpx;
                margin-top: 18rpx;
                color: rgba(173, 174, 177, 1);
            }
        }
    }

    &-boardList{
        height: 260rpx;
        margin-top: 200rpx;
        display: flex;
        position: relative;
        &-item{
            position: absolute;
            height: 100%;
            border: 1px solid rgba(106, 105, 113, 1);
            border-radius: 16rpx;
            left: 0;
            width: 200rpx;

            $liList: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9;
            @each $index in $liList {
                &:nth-child(#{$index}) {
                    left: 50 * $index + rpx;
                    z-index: $index;
                }
            }
           
        }
    }
}